import {
  ProCard,
  ProForm,
  ProFormDependency,
  ProFormField,
  ProFormDigit,
  ProFormGroup,
  ProFormRadio,
  ProFormTextArea,
  useDebounceFn,
  FormListActionType,
  ProFormList,
  ProFormSelect,
  ProFormSwitch,
  ProFormText,
  ProFormItem,
} from '@ant-design/pro-components';
import { Button, Col, Collapse, message, Row, Tabs } from 'antd';
import React, { useContext } from 'react';
import type { ProFormInstance } from '@ant-design/pro-components';
import { useRef, useState } from 'react';
import PropTypes from 'prop-types';
import lodash from 'lodash';
import { ApiType, ApiInfo, EventFormType, ProTableContexteValue, ProFormInfo, FormType, FormInfo, Forms } from '../ProTableDynamic/utils/types';
import ProFormDynamic from '../ProTableDynamic/subComps/ProFormDynamic';
import { configSettingUI } from '../ProTableDynamicSettings/configSettingUI';
import { defaultProFormConfig, initConfig } from '../ProTableDynamic/subComps/ProFormDynamic/config';
import { dataSource } from '../ProTableDynamic/utils/dataSource';
import { ProTableContext } from '../Context/ProTableContext';
import { formFieldArray } from '@/utils/types';
import { dealApiSelectDetail } from '@/utils/dataDeal';

const ProFormDynamicSettings = (props: any) => {
  ///开始删除
  // 全局数据源
  const proTableContexteValue: ProTableContexteValue = useContext<ProTableContexteValue>(ProTableContext); // 获取公共数据
  ///结束删除
  const [operateFormType, setOperateFormType] = useState<FormType>('detail');

  const dealFormItem = (columns: any[]): any[] => {
    if (columns) {
      return columns.map((column: any) => {
        column.hide = false;
        return column;
      });
    } else {
      return [];
    }
  };
  const mergeFormInfo = (source1: ProFormInfo, source2: ProFormInfo): ProFormInfo => {
    let newTarget: ProFormInfo = {} as ProFormInfo;
    lodash.merge(newTarget, source1);
    lodash.merge(newTarget, source2);
    return newTarget;
  };
  const dealFormConfig = (initConfig: ProFormInfo, propsConfig: ProFormInfo): ProFormInfo => {
    if (props.isTable && Object.keys(proTableContexteValue.formInfo).length !== 0) {
      // 如果已经缓存，使用缓存的数据
      return proTableContexteValue.formInfo;
    }
    let newInitConfig: ProFormInfo = lodash.cloneDeep(initConfig);
    const newPropsConfig = { dataSource: { ...initConfig.dataSource, ...propsConfig.dataSource } } as ProFormInfo;
    mergeFormInfo(newInitConfig, newPropsConfig);
    if (props.isTable) {
      newInitConfig.dataSource.keyInfo = propsConfig.dataSource.keyInfo;
    }
    Object.entries(newInitConfig.forms).forEach(([key, keyValue]: [string, FormInfo], index) => {
      const formType: FormType = key as FormType;
      // 没有的配置从默认配置中取
      newInitConfig.forms[formType] = {
        formFields: [...(initConfig.forms[formType].formFields ?? [])], // 此处合并应该有问题应该加[formType]
        formConfig: { ...defaultProFormConfig, ...keyValue.formConfig },
      };
    });
    return newInitConfig;
  };

  const [eventFormType, setEventFormType] = useState<EventFormType>('');
  const onEventFormType = (newEventFormType: EventFormType) => {
    // console.debug('表单操作事件监听', eventFormType);
    setEventFormType(newEventFormType + Math.random());
  };

  const [config, setConfig] = useState<ProFormInfo>({ ...dealFormConfig(initConfig(), props.config) }); // 配置信息

  const updateConfig = useDebounceFn(async (state: ProFormInfo) => {
    let newConfig = { ...config };
    newConfig = mergeFormInfo(newConfig, state);
    console.debug('ProFormDynamicSettings表单更新', state, newConfig);
    setConfig({ ...newConfig });
  }, 100);

  const baseRef = useRef<ProFormInstance>(); // 基础配置表单
  const columnsRef = useRef<ProFormInstance>(); // 列配置表单
  const dataSourceFormRef = useRef<ProFormInstance>(); // 数据源表单

  const currentOperateFormRef = useRef<ProFormInstance>(); // 控制当前操作的表单
  const updateCurrentOperateFormType = useDebounceFn(async (state: { operateFormType: FormType }) => {
    let newConfig = { ...config };
    // 切换表单类型
    const formType: FormType = state.operateFormType;
    // 如果没有默认数据，则使用默认配置
    if (!newConfig.forms[formType] || Object.keys(newConfig.forms[formType].formConfig).length === 0) {
      newConfig.forms[formType] = { formConfig: defaultProFormConfig, formFields: [] };
    }
    console.debug('ProFormDynamicSettings表单更新', state, newConfig);
    setOperateFormType(formType);
    setConfig(newConfig);
  }, 100);
  const updateOperateFormType = (formType: FormType) => {
    setOperateFormType(formType);
    currentOperateFormRef.current?.setFieldsValue({ operateFormType: formType });
  };

  React.useEffect(() => {
    // 更新表单项
    const newConfig = dealFormConfig(initConfig(), props.config);
    console.debug('ProFormDynamicSettings 更新动态表单props', newConfig, props.config);
    setConfig({ ...newConfig });
  }, [props.config]);

  React.useEffect(() => {
    baseRef.current?.setFieldsValue({ ...config });
    columnsRef.current?.setFieldsValue({ ...config });
    dataSourceFormRef.current?.setFieldsValue({ ...config });
    currentOperateFormRef.current?.setFieldsValue({ operateFormType });
    // console.debug('ProFormDynamicSettings 更新动态表单字段：', config);
  }, [config]);

  const exetTableDetailDataSource = async (detail: ApiInfo) => {
    const tableDataDetail: any = await dataSource('detail', detail, '');
    if (!tableDataDetail) return {};
    const formType = operateFormType;

    let newColumns = dealApiSelectDetail(tableDataDetail);

    const newConfig: ProFormInfo = { ...config };

    const newForm: FormInfo = {
      formConfig: { ...config.forms[formType].formConfig },
      formFields: [...(config.forms[formType].formFields ?? []), ...newColumns],
    };
    newConfig.forms[formType] = newForm;

    console.debug('exetTableDetailDataSource', operateFormType, config, newConfig);
    setConfig(newConfig);
    onEventFormType('eventReloadForm');
  };
  const exetDataSource = (apiType: ApiType) => {
    const apiInfo: ApiInfo = config.dataSource.apiList[apiType];
    const key = config.dataSource.keyInfo.key;
    switch (apiType) {
      case 'detail':
        // 赋值主键
        if (!apiInfo.parameter || Object.keys(apiInfo.parameter).length === 0) {
          apiInfo.parameter = {};
        }
        // 如果是表格内嵌的使用表格传过来的记录
        if (props.isTable) {
          apiInfo.parameter[key] = props.currentTableRecord.record[key];
        } else {
          // 否则使用配置的
          apiInfo.parameter[key] = config.dataSource.keyInfo.value;
        }
        exetTableDetailDataSource(apiInfo);
        break;
      default:
        message.error('数据源类型错误' + apiType);
        return;
    }
  };
  const fillDataSource = () => {
    const newConfig: ProFormInfo = { ...config };

    mergeFormInfo(newConfig, {
      ...config,
      dataSource: {
        keyInfo: {
          key: 'id',
          value: 5,
        },
        apiList: {
          list: {
            url: '/api/selectList',
            method: 'Get',
            afterScript: 'returnData=response.data', // 后执行脚本
          },
          detail: {
            url: '/api/selectDetail',
            method: 'Get',
            afterScript: 'returnData=response.data', // 后执行脚本
          },
          add: {
            url: '/api/add',
            method: 'Post',
            afterScript: 'returnData=response.data', // 后执行脚本
          },
          delete: {
            url: '/api/delete',
            method: 'Get',
            afterScript: 'returnData=response.data', // 后执行脚本
          },
          update: {
            url: '/api/update',
            method: 'Post',
            afterScript: 'returnData=response.data', // 后执行脚本
          },
          deleteBatch: {
            url: '/api/update',
            method: 'Post',
            afterScript: 'returnData=response.data', // 后执行脚本
          },
        },
      },
    } as ProFormInfo);
    setConfig(newConfig);
    dataSourceFormRef?.current?.setFieldsValue(newConfig);
  };
  React.useEffect(() => {
    exetDataSource('detail'); // 初始化执行一次
  }, []);
  console.debug(
    'ProFormDynamicSettings初始化',
    'props.config:',
    props.config,
    'config:',
    config,
    'operateFormType:',
    operateFormType,
    'currentTableRecord:',
    props.currentTableRecord,
  );
  const onCollapseChange = (key: string | string[]) => {
    console.log(key);
  };
  const proFormCardStyle = { boxShadow: 'rgba(0, 0, 0, 0.24) 0px 3px 8px' };
  return (
    <div style={{ display: 'flex', height: '100%', overflow: 'auto' }}>
      <ProCard style={{ width: '70%', height: '100%', overflow: 'auto' }}>
        {/* <Collapse defaultActiveKey={['1', '2', '3']} onChange={onCollapseChange}>
          <Row>
            <Col span={12} style={{ padding: '10px' }}>
              <Collapse.Panel header="This is panel header 1" key="1">
                <p>123</p>
              </Collapse.Panel>
            </Col>
            <Col span={12} style={{ padding: '10px' }}>
              <Collapse.Panel header="This is panel header 2" key="2">
                <p>123</p>
              </Collapse.Panel>
            </Col>
            <Col span={12} style={{ padding: '10px' }}>
              <Collapse.Panel header="This is panel header 3" key="3">
                <p>123</p>
              </Collapse.Panel>
            </Col>
          </Row>
        </Collapse> */}

        <ProCard bordered={true} bodyStyle={{ padding: '0' }}>
          <Row style={{ display: 'flex' }}>
            <Col span={12} style={{ padding: '10px' }}>
              <ProCard
                title="查"
                onClick={() => {
                  updateOperateFormType('detail');
                }}
                bordered={true}
                style={operateFormType === 'detail' ? proFormCardStyle : undefined}
                collapsible
              >
                <ProFormDynamic
                  formType="detail"
                  config={config}
                  dynamic={true}
                  isTable={props.isTable}
                  eventFormType={eventFormType}
                  currentTableRecord={props.currentTableRecord}
                />
              </ProCard>
            </Col>
            <Col span={12} style={{ padding: '10px' }}>
              <ProCard
                title="改"
                onClick={() => {
                  updateOperateFormType('edit');
                }}
                bordered={true}
                style={operateFormType === 'edit' ? proFormCardStyle : undefined}
                collapsible
              >
                <ProFormDynamic
                  formType="edit"
                  config={config}
                  dynamic={true}
                  isTable={props.isTable}
                  eventFormType={eventFormType}
                  currentTableRecord={props.currentTableRecord}
                />
              </ProCard>
            </Col>
            <Col span={12} style={{ padding: '10px' }}>
              <ProCard
                title="增"
                onClick={() => {
                  updateOperateFormType('add');
                }}
                bordered={true}
                style={operateFormType === 'add' ? proFormCardStyle : undefined}
                collapsible
              >
                <ProFormDynamic formType="add" config={config} dynamic={true} isTable={props.isTable} eventFormType={eventFormType} currentTableRecord={props.currentTableRecord} />
              </ProCard>
            </Col>
          </Row>
        </ProCard>
      </ProCard>
      <div style={{ width: '30%', minWidth: '400px', height: '100%', overflow: 'auto', background: '#fff', borderLeft: '1px solid #eeeeee' }}>
        <Tabs
          defaultActiveKey="tab1"
          style={{
            paddingLeft: '20px',
            paddingRight: '20px',
            height: '100%',
            overflow: 'auto',
          }}
          animated={true}
          items={[
            {
              label: '基本配置',
              key: 'tab1',
              forceRender: true,
              children: (
                <>
                  <ProForm
                    layout="horizontal"
                    labelAlign="left"
                    labelCol={{ span: 8 }}
                    wrapperCol={{ span: 16 }}
                    size={configSettingUI.size}
                    onValuesChange={(_, values) => {
                      updateCurrentOperateFormType.run(values);
                    }}
                    submitter={false}
                    formRef={currentOperateFormRef}
                  >
                    <ProFormRadio.Group
                      tooltip={`type={{${operateFormType}}}`}
                      radioType="button"
                      options={[
                        {
                          label: '查',
                          value: 'detail',
                        },
                        {
                          label: '改',
                          value: 'edit',
                        },
                        {
                          label: '增',
                          value: 'add',
                        },
                      ]}
                      label="当前操作的表单"
                      name="operateFormType"
                    />
                  </ProForm>
                  <ProForm
                    layout="horizontal"
                    labelCol={{ span: 8 }}
                    labelAlign="left"
                    wrapperCol={{ span: 16 }}
                    size={configSettingUI.size}
                    formRef={baseRef}
                    onValuesChange={(_, values) => {
                      updateConfig.run(values);
                    }}
                    submitter={false}
                  >
                    <ProFormSwitch label="只读" tooltip="readonly" name={['forms', operateFormType, 'formConfig', 'readonly']} />
                    <ProFormRadio.Group
                      tooltip={`size="middle"`}
                      radioType="button"
                      label="尺寸"
                      options={[
                        {
                          label: '小',
                          value: 'small',
                        },
                        {
                          label: '中',
                          value: 'middle',
                        },
                        {
                          label: '大',
                          value: 'large',
                        },
                      ]}
                      name={['forms', operateFormType, 'formConfig', 'size']}
                    />
                    <ProFormRadio.Group
                      radioType="button"
                      name={['forms', operateFormType, 'formConfig', 'layout']}
                      tooltip={`layout:"${config.forms[operateFormType].formConfig.layout}"`}
                      options={[
                        {
                          label: '横向',
                          value: 'horizontal',
                        },
                        {
                          label: '纵向',
                          value: 'vertical',
                        },
                        {
                          label: '行内',
                          value: 'inline',
                        },
                      ]}
                      label="表单布局"
                    />
                    <ProFormSwitch
                      colProps={{
                        span: 4,
                      }}
                      label="网格布局"
                      name={['forms', operateFormType, 'formConfig', 'grid']}
                    />
                    <ProFormDependency name={[['forms', operateFormType, 'formConfig', 'layout']]}>
                      {({ forms }) => {
                        if (!forms) {
                          return <></>;
                        }
                        if (forms[operateFormType].formConfig.layout !== 'horizontal') {
                          return (
                            <>
                              <ProFormDigit label="标签栅格" name={['forms', operateFormType, 'formConfig', 'labelCol', 'span']} />
                              <ProFormDigit label="控件栅格" name={['forms', operateFormType, 'formConfig', 'wrapperCol', 'span']} />
                            </>
                          );
                        }
                        return (
                          <>
                            <ProFormDigit label="标签栅格" name={['forms', operateFormType, 'formConfig', 'labelCol', 'span']} />
                            <ProFormDigit label="控件栅格" name={['forms', operateFormType, 'formConfig', 'wrapperCol', 'span']} />
                            <ProFormDigit label="按钮栅格" name={['forms', operateFormType, 'formConfig', 'submitWrapperCol', 'span']} />
                            <ProFormDigit label="按钮偏移" name={['forms', operateFormType, 'formConfig', 'submitWrapperCol', 'offset']} />
                          </>
                        );
                      }}
                    </ProFormDependency>
                    <ProFormSwitch
                      label="显示重置按钮"
                      tooltip={`layout:"${config.forms[operateFormType].formConfig.showReset}"`}
                      name={['forms', operateFormType, 'formConfig', 'showReset']}
                    />
                    <ProFormDependency name={[['forms', operateFormType, 'formConfig', 'showReset']]}>
                      {({ forms }) => {
                        if (!forms) {
                          return <></>;
                        }
                        if (!forms[operateFormType].formConfig.showReset) {
                          return <></>;
                        }
                        return (
                          <>
                            <ProFormText label="按钮文本" name={['forms', operateFormType, 'formConfig', 'resetText']} />
                          </>
                        );
                      }}
                    </ProFormDependency>
                    <ProFormSwitch
                      label="显示提交按钮"
                      tooltip={`layout:"${config.forms[operateFormType].formConfig.showSubmit}"`}
                      name={['forms', operateFormType, 'formConfig', 'showSubmit']}
                    />
                    <ProFormDependency name={[['forms', operateFormType, 'formConfig', 'showSubmit']]}>
                      {({ forms }) => {
                        if (!forms) {
                          return <></>;
                        }
                        if (!forms[operateFormType].formConfig.showSubmit) {
                          return <></>;
                        }
                        return (
                          <>
                            <ProFormText label="按钮文本" name={['forms', operateFormType, 'formConfig', 'submitText']} />
                          </>
                        );
                      }}
                    </ProFormDependency>
                  </ProForm>
                </>
              ),
            },
            {
              label: '数据源',
              key: 'dataSource',
              forceRender: true,
              children: (
                <>
                  <ProForm
                    layout="horizontal"
                    labelAlign="left"
                    labelCol={{ span: 8 }}
                    wrapperCol={{ span: 16 }}
                    size={configSettingUI.size}
                    onValuesChange={(_, values) => {
                      updateConfig.run(values);
                    }}
                    submitter={false}
                    formRef={dataSourceFormRef}
                  >
                    <ProFormItem>
                      <Button type="primary" htmlType="button" onClick={fillDataSource} key="edit">
                        使用数据源1
                      </Button>
                    </ProFormItem>

                    <ProFormText
                      name={['dataSource', 'keyInfo', 'key']}
                      label="主键Key"
                      tooltip="数据唯一键"
                      placeholder="请输入主键Key"
                      readonly={props.isTable ? true : false} // 如果是表格传递来的，只能使用表格的record
                      rules={[
                        {
                          required: true,
                          message: '请输入主键Key',
                        },
                      ]}
                    />
                    {
                      // 如果是表格传递来的，只能使用表格的record
                      !props.isTable ? (
                        <ProFormText
                          name={['dataSource', 'keyInfo', 'value']}
                          label="主键Value"
                          tooltip="数据唯一键的有效值"
                          placeholder="请输入主键Value"
                          rules={[
                            {
                              required: true,
                              message: '请输入主键Value',
                            },
                          ]}
                        />
                      ) : null
                    }
                    {operateFormType === 'detail' ? (
                      <>
                        <ProFormGroup title="查-详情" collapsible defaultCollapsed={false} direction="horizontal" labelLayout="twoLine">
                          <ProFormText
                            name={['dataSource', 'apiList', 'detail', 'url']}
                            label="URL地址"
                            tooltip="URL地址"
                            placeholder="请输入URL"
                            rules={[
                              {
                                required: true,
                                message: '请输入URL',
                              },
                            ]}
                          />
                          <ProFormRadio.Group
                            name={['dataSource', 'apiList', 'detail', 'method']}
                            tooltip="请求方式"
                            label="请求方式"
                            radioType="button"
                            valueEnum={{
                              GET: 'GET',
                              POST: 'POST',
                              Put: 'PUT',
                              Delete: 'DELETE',
                            }}
                            rules={[
                              {
                                required: true,
                                message: '请选择请求方式！',
                              },
                            ]}
                          />
                          <ProFormTextArea
                            name={['dataSource', 'apiList', 'detail', 'afterScript']}
                            label="后执行脚本"
                            tooltip="解析返回的数据,response为响应数据,data代表解析到的数据,total代表总条数"
                            placeholder="请输入后执行脚本"
                          />
                        </ProFormGroup>
                      </>
                    ) : operateFormType === 'add' ? (
                      <>
                        <ProForm.Group title="增" collapsible defaultCollapsed={false} direction="horizontal" labelLayout="twoLine">
                          <ProFormText
                            name={['dataSource', 'apiList', 'add', 'url']}
                            label="URL地址"
                            tooltip="URL地址"
                            placeholder="请输入URL"
                            rules={[
                              {
                                required: true,
                                message: '请输入URL',
                              },
                            ]}
                          />
                          <ProFormRadio.Group
                            name={['dataSource', 'apiList', 'add', 'method']}
                            tooltip="请求方式"
                            label="请求方式"
                            radioType="button"
                            valueEnum={{
                              GET: 'GET',
                              POST: 'POST',
                              Put: 'PUT',
                              Delete: 'DELETE',
                            }}
                            rules={[
                              {
                                required: true,
                                message: '请选择请求方式！',
                              },
                            ]}
                          />
                          <ProFormTextArea
                            name={['dataSource', 'apiList', 'add', 'afterScript']}
                            label="后执行脚本"
                            tooltip="解析返回的数据,response为响应数据,data代表解析到的数据,total代表总条数"
                            placeholder="请输入后执行脚本"
                          />
                        </ProForm.Group>
                      </>
                    ) : operateFormType === 'edit' ? (
                      <>
                        <ProFormGroup title="查-详情" collapsible defaultCollapsed={false} direction="horizontal" labelLayout="twoLine">
                          <ProFormText
                            name={['dataSource', 'apiList', 'detail', 'url']}
                            label="URL地址"
                            tooltip="URL地址"
                            placeholder="请输入URL"
                            rules={[
                              {
                                required: true,
                                message: '请输入URL',
                              },
                            ]}
                          />
                          <ProFormRadio.Group
                            name={['dataSource', 'apiList', 'detail', 'method']}
                            tooltip="请求方式"
                            label="请求方式"
                            radioType="button"
                            valueEnum={{
                              GET: 'GET',
                              POST: 'POST',
                              Put: 'PUT',
                              Delete: 'DELETE',
                            }}
                            rules={[
                              {
                                required: true,
                                message: '请选择请求方式！',
                              },
                            ]}
                          />
                          <ProFormTextArea
                            name={['dataSource', 'apiList', 'detail', 'afterScript']}
                            label="后执行脚本"
                            tooltip="解析返回的数据,response为响应数据,data代表解析到的数据,total代表总条数"
                            placeholder="请输入后执行脚本"
                          />
                        </ProFormGroup>
                        <ProForm.Group title="改" collapsible defaultCollapsed={false}>
                          <ProFormText
                            name={['dataSource', 'apiList', 'update', 'url']}
                            label="URL地址"
                            tooltip="URL地址"
                            placeholder="请输入URL"
                            rules={[
                              {
                                required: true,
                                message: '请输入URL',
                              },
                            ]}
                          />
                          <ProFormRadio.Group
                            name={['dataSource', 'apiList', 'update', 'method']}
                            tooltip="请求方式"
                            label="请求方式"
                            radioType="button"
                            valueEnum={{
                              GET: 'GET',
                              POST: 'POST',
                              Put: 'PUT',
                              Delete: 'DELETE',
                            }}
                            rules={[
                              {
                                required: true,
                                message: '请选择请求方式！',
                              },
                            ]}
                          />
                          <ProFormTextArea
                            name={['dataSource', 'apiList', 'update', 'afterScript']}
                            label="后执行脚本"
                            tooltip="解析返回的数据,response为响应数据,data代表解析到的数据,total代表总条数"
                            placeholder="请输入后执行脚本"
                          />
                        </ProForm.Group>
                      </>
                    ) : (
                      <></>
                    )}
                    <ProFormItem>
                      <Button type="primary" onClick={() => exetDataSource('detail')}>
                        生成表单
                      </Button>
                    </ProFormItem>
                  </ProForm>
                </>
              ),
            },
            {
              label: '表单列',
              key: 'tab2',
              forceRender: true,
              children: (
                <>
                  <ProForm layout="inline" size={configSettingUI.size} formRef={columnsRef} onValuesChange={(_, values) => updateConfig.run(values)} submitter={false}>
                    <ProFormList
                      name={['forms', operateFormType, 'formFields']}
                      style={{ width: '100%' }}
                      itemRender={({ listDom, action }) => {
                        return (
                          <ProCard
                            bordered
                            style={{
                              marginBlockEnd: 8,
                              position: 'relative',
                              padding: '10px 0px',
                            }}
                            bodyStyle={{
                              padding: 8,
                              paddingInlineEnd: 32,
                              paddingBlockStart: 16,
                            }}
                          >
                            <div
                              style={{
                                position: 'absolute',
                                top: -4,
                                right: 2,
                              }}
                            >
                              {action}
                            </div>
                            {listDom}
                          </ProCard>
                        );
                      }}
                    >
                      <ProFormText name="title" label="label" />
                      <ProFormText name="value" label="value" />
                      <ProFormSwitch label="隐藏" name="hide" />
                      <ProFormSelect
                        label="控件类型"
                        name="formFieldType"
                        options={formFieldArray.map((formField) => ({
                          label: formField.label,
                          value: formField.value,
                        }))}
                      />
                      <ProFormText label="输入提示" name="placeholder" />
                      <ProFormText label="列提示" name="tooltip" />
                      <ProFormDependency name={['valueType', 'valueEnum']}>
                        {({ valueType, valueEnum }) => {
                          if (valueType !== 'select') {
                            return null;
                          }
                          return (
                            <ProFormTextArea
                              formItemProps={{}}
                              fieldProps={{
                                value: JSON.stringify(valueEnum),
                              }}
                              normalize={(value: any) => {
                                return JSON.parse(value);
                              }}
                              label="数据枚举"
                              name="valueEnum"
                            />
                          );
                        }}
                      </ProFormDependency>
                    </ProFormList>
                  </ProForm>
                </>
              ),
            },
          ]}
        />
      </div>
    </div>
  );
};

ProFormDynamicSettings.propTypes = {
  config: PropTypes.object,
  isTable: PropTypes.bool, // 是否动态组件
  currentTableRecord: PropTypes.object,
};
export default ProFormDynamicSettings;
